其實直播也不知道幹麼就是來玩一下而已
首先Synology的docker安裝livego
下面程式碼flv_archive如果用true的話,每次直播都會產生一個檔案。
livego.yaml
# # Logger level
# level: info
# # FLV Options
flv_archive: false
flv_dir: "./tmp"
# httpflv_addr: ":7001"
# # RTMP Options
# rtmp_noauth: false
# rtmp_addr: ":1935"
# read_timeout: 10
# write_timeout: 10
# # HLS Options
# hls_addr: ":7002"
# # API Options
# api_addr: ":8090"
server:
- appname: live
live: true
hls: true
api: true
flv: true
docker架完之後,輸入下列網址
http://localhost:8090/control/get?room=demo
正常會顯示下面畫面,黑框為token
接下來換到manycam
點擊增加rtmp伺服器
URL為rtmp://localhost:1935/live
串流key就是你剛才的token
輸入完之後就可以按中間開始直播了
這邊透過ChatGPT提供一個hls的網頁範例
<!DOCTYPE html>
<html>
<head>
<title>直播網站</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 引入hls.js庫 -->
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<style>
body {
margin: 0;
padding: 0;
}
#player {
width: 100%;
height: 500px;
background-color: #000;
color: #fff;
text-align: center;
font-size: 24px;
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<div id="player">
<p>這裡是直播視頻</p>
</div>
<script>
if(Hls.isSupported()) {
var video = document.createElement('video');
video.setAttribute('controls', '');
video.setAttribute('width', '100%');
video.setAttribute('height', '500px');
document.getElementById('player').appendChild(video);
var hls = new Hls();
hls.loadSource('http://localhost:7002/live/demo.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
</script>
</body>
</html>
連上這個html就會有直播了